<template>
	<view class="safe-area-inset-bottom">
		<view class="swip_header">
		<view class="slot-box">
			<view style="width: 100%;">
				<uni-search-bar v-model="queryParams.params.findApi" type="text" @confirm="handleQuery"
					@input="handleQuery" placeholder="请输入姓名" />
			</view>
		</view>
		</view>

		<view class="scroll_view" v-if="staffList.length !== 0">
			<view @click="selectChange(item)" v-for="(item, index) in staffList" :key="index" class="table_view">
				<view class="table_span" style="justify-content: space-between;">
					<span>{{item.deptName}}</span>
					<span style="color: #00a660;">使用</span>
				</view>
				<view class="table_span" style="font-size: 26rpx;color: #666666;">
					<span style="width: 60%;">
						<i class="iconfont grayIcon" style="margin:0 10rpx 0 0;font-size: 30rpx;"
							v-if="item.isCertify == 0">&#xe625;</i>
						<i class="iconfont greenIcon" style="margin:0 10rpx 0 0;font-size: 27rpx;" v-else>&#xe625;</i>
						{{item.name}}@{{item.mobile}}</span>
					<span class="over_flow">
						<span
							v-if="$store.getters.companyInfo.adminId == item.id && $store.getters.companyInfo.legalPersonId == item.id">
							法定代表人,企业管理员,{{ item.roleName.replace("普通员工", "") }}
						</span>
						<span v-else-if="$store.getters.companyInfo.legalPersonId == item.id">
							法定代表人,{{ item.roleName.replace("普通员工", "") }}
						</span>
						<span v-else-if="$store.getters.companyInfo.adminId == item.id">
							企业管理员,{{ item.roleName.replace("普通员工", "") }}
						</span>
						<span v-else>{{ item.roleName }}</span>
					</span>
				</view>
			</view>
		</view>

		<!-- 暂无数据 -->
		<luanqingEmpty :show="true" text="没有更多数据啦" v-else />
	</view>
</template>

<script>
	import luanqingEmpty from '@/components/luanqing-empty/luanqing-empty';
	import {
		listStaffPager
	} from "@/api/ec/console/org/staff";
	import {
		addDateRange
	} from "@/utils/ruoyi"
	export default {
		components: {
			luanqingEmpty
		},
		data() {
			return {
				staffList: [], // 员工表格数据
				// 查询参数
				queryParams: {
					pageNum: 1,
					pageSize: 10,
					isCertify: 1,
					status: 1,
					params: {
						findApi: undefined
					}
				},
			 // 选中员工信息
				selectStaffId: null,
				selectStaff: null,
			};
		},
		onLoad(option) {
			this.getList()
		},
		methods: {
			getList() {
        this.$modal.loading();
				listStaffPager(this.queryParams).then(response => {
					uni.hideLoading()
					this.staffList = response.rows;
					if (this.staffInfo != null) {
						this.selectStaff = this.staffInfo;
						this.selectStaffId = this.staffInfo.id;
					} else {
						this.selectStaff = null;
						this.selectStaffId = null;
					}
				});
			},
			/**搜索*/
			handleQuery() {
				this.getList()
			},
			/** 选择使用 */
			selectChange(item) {
				this.selectStaffId = item.id;
				this.selectStaff = item;
				uni.$emit('selectStaff', {
					selectStaff: item
				});
				uni.navigateBack(1)
			},
		}
	}
</script>

<style lang="scss" scoped>
	.over_flow {
		overflow: hidden;
		white-space: normal;
		text-overflow: ellipsis;
		-webkit-line-clamp: 1; //显示行数
		// display: -webkit-box; /*作为弹性伸缩盒子模型显示*/
		-webkit-box-orient: vertical;
		/*伸缩盒子的排列方式：从上到下垂直*/
		width: 40%;
	}

	page {
		background: $uni-bg-color;
	}

	.scroll_view {
		position: absolute;
		top: 110rpx;
		height: 80%;
		width: 100%;
		overflow-y: scroll;
	}

	.table_view {
		border-bottom: 1rpx solid #ebeef5;
		padding: 15rpx 20rpx 15rpx 0;
		margin: 0 20rpx;
	}

	.table_span {
		margin-top: 15rpx;
		display: flex;
		align-items: center;
		color: #000;
	}
</style>
